﻿@using Web
@using Web.ViewModels
@model RoomViewModel
@{
	ViewData["Title"] = Model.Name + "--直播室";
}
@{

	Layout = null;
}
<!DOCTYPE html>
<!-- saved from url=(0065)http://zhjf.hv678.com/classroom/e61a8e2e72ff444fab9f0f9129eadc9d/ -->
<html lang="cn">

<head>
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<meta name="renderer" content="webkit">
	<meta http-equiv="content-type" content="text/html;charset=utf-8">
	<link type="text/css" rel="stylesheet" href="/ffd/hv.css">
	<link href="/css/global.css" rel="stylesheet" />
	<title>@Model.Name </title>
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
	<script type="text/javascript" src="/js/jquery.min.js"></script>

	<script src="/ffd/jwplayer.js"></script>
	<script src="/ffd/hv678im.min.js"></script>
	<script src="/ffd/hv678live.min.js"></script>

	<script src="/ffd/respond.min.js"></script>

	<script src="/ffd/common.min.js"></script>
	<link href="/ThirdParty/layui/2.2.2/css/layui.css" rel="stylesheet" />
	<link rel="stylesheet" href="/ffd/layer.css?v=1000" id="layuicss-skinlayercss">

	<link rel="stylesheet" href="/ffd/aa.css" id="layuicss-skinlayercss">
	<link rel="stylesheet" href="/ffd/bb.css" id="layuicss-skinlayercss">
	<link rel="stylesheet" href="/ffd/cc.css" id="layuicss-skinlayercss">
	<link rel="stylesheet" id="loader_1480642380052" href="/ffd/classroom_new.min.css">
	<link href="/css/Default.css" rel="stylesheet" />
	<link href="/css/HeadPictureCss.css" rel="stylesheet" />
	 
	<script src="~/ThirdParty/jqueryui/1.10.4/jquery-ui.js"></script>
	<script src="/Scripts/json2.js"></script>
	 

	@*项目*@
	<script src="/Scripts/app.js?v=20170224"></script>
	@*第三方 xdate*@
	<script src="/ThirdParty/xdate.js"></script>
	  
	@*qq表情*@
	<link href="~/css/qqface.css" rel="stylesheet" />
	<script src="~/ThirdParty/qqface/jquery.qqFace.js?v=1"></script>
	<script src="~/Views/home/qqface.js"></script>
</head>

<body class="classroom3 with-bottom">
	<div id="room_content_10"></div>
	<div class="top overflow">
		<div class="fl logo text_center no_background" id="room_content_11"></div>
		<div class="fl classroom3_list" id="room_content_1">
			<a href="/s.aspx" target="_blank"><img src="/ffd/d2ffa7f799814e8290f8cda4b95aed1a.png">保存到桌面</a>
		</div>
		<div class="room_title fl">
			<h2 id="classroom_name">@Model.Name</h2>
		</div>
		<div class="fr overflow loginGroup">
			<div id="area_unsigned" class="no_login">
				<span id="usernickname" class="fl visitorInfo">@User.Identity.Name</span>

				@*<span class="fl login_now" id="l">登录</span><span class="fl reg_now">注册</span>*@


			</div>
		</div>
	</div>
	<div class="room3_list">
		<ul id="room_content_2">
			<div class="show_stu">
				<div class="show_stu_now text_center hide">查看在线学员</div>
			</div>
			<li data-url="@Url.Action("Index", "Course")" data-id="show_c">
				<a href="javascript:;" onclick="return false" target="_blank">
					<p class="text_center"><img style="width:39px;height:39px;" src="/ffd/fd82c1850a15433aa2648b5b8f9b2aa9.png"></p>
					<p class="text_center">课程表</p>
				</a>
			</li>
			<li data-url="http://www.caijingriliba.com/" data-id="show_fc">
				<a href="javascript:;" onclick="return false" target="_blank">
					<p class="text_center"><img style="width:39px;height:39px;" src="/ffd/254f57bb2e21450bb46d142d317b4339.png"></p>
					<p class="text_center">财经日历</p>
				</a>
			</li>
			<li data-url="https://wallstreetcn.com/live/global?from=navbar" data-id="show_zx">
				<a href="javascript:;" onclick="return false" target="_blank">
					<p class="text_center"><img style="width:39px;height:39px;" src="/ffd/b4796542605549fd809281bba0a225bf.png"></p>
					<p class="text_center">财经资讯</p>
				</a>
			</li>
			<li data-url="@Url.Action("Teacher", "Course")" data-id="show_teacher">
				<a href="javascript:;" target="_blank">
					<p class="text_center"><img style="width:39px;height:39px;" src="/ffd/d0e2232656f5461d835bf111931a7ff7.png"></p>
					<p class="text_center">在线讲师</p>
				</a>
			</li>
			<li data-url="@Url.Action("Down", "Course")" data-id="show_soft">
				<a href="javascript:;" target="_blank">
					<p class="text_center"><img style="width:39px;height:39px;" src="/ffd/08b076c71e764d3f848285e71e21ea50.png"></p>
					<p class="text_center">软件下载</p>
				</a>
			</li>
		</ul>
	</div>
	<div class="content_wrap room3_content_wrap">
		<div class="content" style="padding-right: 829px;">

			<div class="left" style="left: 0px;">
				<div class="reserve_01" id="room_content_3">
					<a href="javascript:" ;onclick="return false" target="_blank"><img src="@Model.Logo"></a>
				</div>
				<div class="stu_list room3_stu_list market-fllow">
					<div class="stu_title room3_title">
						<span>在线学员</span>
						<span id=""></span>

					</div>
					<div class="stu_con" id="online">
						<ul class="students" id="users">
							@*在线学员列表区*@
						</ul>
					</div>
				</div>
				<div id="room_content_4" class="reserve_02"></div>
			</div>

			<div class="middle">

				<div class="middle_top">
					<div class="middle_title room3_title">
						<p class="alert_title">公告</p>
						<marquee scrollamount="2" id="room_content_9" onmouseover=this.stop() onmouseout=this.start()>@Html.Raw(Model.Remarks)</marquee>
					</div>

					<!--列表-->

					<div class="middle_cont">
						<div class="messages" id="chatListOut" style="bottom: 0px;">
							<ul id="messages">
								@{
									foreach (ChatMsgViewModel item in Model.ChatMsgs)
									{
										if (item != null)
										{
											<li class="chatli" id="@item.Id">
												<span class="msg-time">@item.CreateAt.ToString("yyyy/MM/dd hh:mm:ss")</span>
												@*<span class="msg-role">老师</span>*@<span class="msg-name">@item.UserIdFrom</span>
												<span class="msg-content" style="color: inherit; font-size: inherit">@Html.Raw(item.Content)</span>
											</li>


										}
									}
								}
							</ul>
						</div>
						<div style="display: none;" id="messagesModel">
							<li class="chatli" id="">
								<span class="msg-time"></span>
								<span class="msg-role"></span><span class="msg-name"></span>
								<span class="msg-content" style="color: inherit; font-size: inherit"></span>
							</li>

						</div>
					</div>
				</div>

				<div class="middle_bot">
					<div class="tool_bar" id="room_content_5">
						<span class="emoj-btn fl pos_rel" id="hv678emoji">表情</span>
						<span class="scroll">滚动</span>
						<span class="clear_screen">清屏</span>
						<span class="awesome">赞</span>
						<span class="upTotop">顶</span>
						<span class="flour" id="flour">撒花</span>
						<span class="caiTiao" id="caiTiao1">彩条</span>
					</div>
					<div class="send_msg back_brown">
						<div class="fl" id="room_content_6">
							<textarea class="emojiarea" id="txtContent" name="txtContent"></textarea>
							<input type="hidden" id="chattext" class="hiddenInput" value="">
						</div>
						<div class="fr">
							<button type="button" id="btnSend">发送</button>
							<input type="hidden" id="txtRoomId" value="@Model.Id" />
							<input type="hidden" id="txtToUserId" />
						</div>
						<div class="clear"></div>
					</div>
				</div>


				<div id="caitiao" class="hid ption_a" style="display: none;bottom:110px;">
					<dl id="c_pt" class="clearfix " isface="2" pack="3">
						<dd id="ding">顶一个</dd>
						<dd id="zan">赞一个</dd>
						<dd id="zhang">掌声</dd>
						<dd id="xian">鲜花</dd>
						<dd id="duo">看多</dd>
						<dd id="kong">看空</dd>
						<dd id="dang">震荡</dd>
					</dl>

					<div class="clearfix"></div>
					<ul id="caitiaonav">
						<li rel="pt" class="f_cur" isnav="1" id="caitiao_nav_3">普通</li>
					</ul>
				</div>
				<script>
					$("#caiTiao1").click(function () {
						$("#caitiao").toggle();
					});
				</script>


			</div>

			<div class="right" style="width: 818.557px;">
				<div class="video" style="bottom: 214.639px;">
					<div class="video_title overflow room3_title" id="room_content_7">
						<div class="fl">视频直播</div>
						<div class="text_red fr" onclick="RefVideo2()">刷新视频</div>
					</div>
					<div class="video_box">
						<div id="videoarea" class="jwplayer jw-reset jw-skin-hv jw-stretch-uniform jw-state-playing jw-flag-compact-player jw-flag-user-inactive" tabindex="0" style="width: 100%; height: 100%;">
							<div class="jw-aspect jw-reset"></div>
							<div id="videoswf" class="jw-media jw-reset">


							</div>

							<div class="jw-preview jw-reset"></div>
							<div class="jw-captions jw-captions-enabled jw-reset" style="font-size: 22px;">
								<div class="jw-captions-window jw-reset"><span class="jw-captions-text jw-reset"></span></div>
							</div>
							<div class="jw-title jw-reset" style="display: none;">
								<div class="jw-title-primary jw-reset"></div>
								<div class="jw-title-secondary jw-reset"></div>
							</div>
							<div class="jw-overlays jw-reset"></div>
							<div class="jw-controls jw-reset">
								<div class="jw-display-icon-container jw-background-color jw-reset">
									<div class="jw-icon jw-icon-display jw-button-color jw-reset"></div>
								</div>
								<div class="jw-controls-right jw-reset">
									<div class="jw-dock jw-reset">
									</div>
								</div>
								<div class="jw-controlbar jw-background-color jw-reset">
									<div class="jw-group jw-controlbar-left-group jw-reset">
										<div class="jw-icon jw-icon-inline jw-button-color jw-reset jw-icon-playback"></div>
										<div class="jw-icon jw-icon-inline jw-button-color jw-reset jw-icon-prev" style="display: none;"></div>
										<div class="jw-icon jw-icon-tooltip jw-icon-playlist jw-button-color jw-reset jw-hidden">
											<div class="jw-overlay jw-reset"></div>
										</div>
										<div class="jw-icon jw-icon-inline jw-button-color jw-reset jw-icon-next" style="display: none;"></div><span class="jw-text jw-reset jw-text-elapsed">01:29</span>
									</div>
									<div class="jw-group jw-controlbar-center-group jw-reset">
										<div class="jw-slider-time jw-background-color jw-reset jw-slider-horizontal jw-reset">
											<div class="jw-slider-container jw-reset">
												<div class="jw-rail jw-reset"></div>
												<div class="jw-buffer jw-reset" style="width: 0%;"></div>
												<div class="jw-progress jw-reset" style="width: 0%;"></div>
												<div class="jw-knob jw-reset" style="left: 0%;"></div>
												<div class="jw-icon jw-icon-tooltip jw-tooltip-time jw-button-color jw-reset">
													<div class="jw-overlay jw-reset">
														<div class="jw-time-tip jw-background-color jw-reset">
															<div class="jw-reset" style="width: 0px; height: 0px;"></div><span class="jw-text jw-reset"></span>
														</div>
													</div>
												</div>
											</div>
										</div><span class="jw-text jw-reset jw-text-alt"></span>
									</div>
									<div class="jw-group jw-controlbar-right-group jw-reset">
										<span class="jw-text jw-reset jw-text-duration">00:00</span>
										<div class="jw-icon jw-icon-tooltip jw-icon-hd jw-button-color jw-reset jw-hidden">
											<div class="jw-overlay jw-reset"></div>
										</div>
										<div class="jw-icon jw-icon-tooltip jw-icon-cc jw-button-color jw-reset jw-hidden jw-off">
											<div class="jw-overlay jw-reset"></div>
										</div>
										<div class="jw-icon jw-icon-tooltip jw-icon-audio-tracks jw-button-color jw-reset jw-hidden">
											<div class="jw-overlay jw-reset"></div>
										</div>
										<div class="jw-icon jw-icon-tooltip jw-icon-more jw-button-color jw-reset jw-hidden jw-off">
											<div class="jw-overlay-horizontal jw-reset"></div>
										</div>
										<div class="jw-icon jw-icon-inline jw-button-color jw-reset jw-icon-volume"></div>
										<div class="jw-icon jw-icon-inline jw-button-color jw-reset jw-icon-cast jw-off" style="display: none;"></div>
										<div class="jw-slider-volume jw-background-color jw-reset jw-slider-horizontal jw-reset">
											<div class="jw-slider-container jw-reset">
												<div class="jw-rail jw-reset"></div>
												<div class="jw-buffer jw-reset"></div>
												<div class="jw-progress jw-reset" style="width: 90%;"></div>
												<div class="jw-knob jw-reset" style="left: 90%;"></div>
											</div>
										</div>
										<div class="jw-icon jw-icon-tooltip jw-icon-volume jw-button-color jw-reset">
											<div class="jw-overlay jw-reset">
												<div class="jw-slider-volume jw-volume-tip jw-background-color jw-reset jw-slider-vertical jw-reset">
													<div class="jw-slider-container jw-reset">
														<div class="jw-rail jw-reset"></div>
														<div class="jw-buffer jw-reset"></div>
														<div class="jw-progress jw-reset" style="height: 90%;"></div>
														<div class="jw-knob jw-reset" style="bottom: 90%;"></div>
													</div>
												</div>
											</div>
										</div>
										<div class="jw-icon jw-icon-inline jw-button-color jw-reset jw-icon-fullscreen"></div>
									</div>
								</div>
							</div>
							<div style="font-size: 12px; text-align: center; width: 100%; height: 50px; line-height: 50px; color: rgb(255, 102, 0); position: absolute; top: 0px; z-index: 10;"></div>
						</div>
					</div>
				</div>

				<!--轮播图-->
				<div class="adds" style="height: 204.639px;">
					<div class="adds_con has-dots" id="room_content_8" style="overflow: hidden; width: 100%; height: 420px;">
						<div class="layui-carousel" id="test1" lay-filter="test1">
							<div carousel-item="">
								<div>

									<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
										<legend>公告</legend>
										@Model.Note1
									</fieldset>
								</div>
								<div>
									<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
										<legend>版权说明</legend>
										@Model.Note2
									</fieldset>
								</div>
								<div>
									<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
										<legend>权限说明</legend>
										@Model.Note3
									</fieldset>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>


	<!--</div>-->
	<!--</div>-->
	<div class="fj_window hide">
		<div class="fjdt">
			<ul id="dongtai_area"></ul>
		</div>
	</div>
	<div class="zx_window hide">
		<div class="cjzx">
			<ul id="zixun_area1"></ul>

		</div>
	</div>
	<div class="teacher_window hide teacher_information overflow">
		<div class="fl teacher_img">
			<img id="teacher_img" src="">
			<p class="teacher_name"></p>
		</div>
		<div class="fl teacher_info_text">
			<h2>简介:</h2>
			<p id="teacher_intro"></p>
		</div>
	</div>

	<img class="room_bg" src="/ffd/8f0924202a8c44a081336495a26b708a.jpg">
	<!--[if lt IE 9]><b id='screwIe'></b><![endif]-->
	<!--[if lt IE 10]><b id='placeIe'></b><![endif]-->
	<!--底部换皮肤二维码-->

	<div class="service_bottom">
		<div class="service_bottom_con">
			<ul>
				<li class="ser_bottom_wx">
					<span class="ser_bottom_img"></span>
					<div class="ser_bottom_list_con hide" id="ewmm">
						<img class="wx-qrcode" src="/ffd/ewm1027.jpg">
					</div>
				</li>
				<li class="ser_bottom_change">
					<span class="ser_bottom_img" id="hf"></span>

					<div class="ser_bottom_list_con hide" style="z-index: 5555555;" id="hfid">
						<div class="bg_imgs">
							<span><img src="http://v.static.hv678.com/roombgimg/820102fc601d4d79b040c51a1eb89ea7.jpg" data-big="http://v.static.hv678.com/roombgimg/aa5336a11160401c93b7e2fa7e2f8e46.jpg"></span>
							<span><img src="http://v.static.hv678.com/roombgimg/300606dc4af14d8cbf9b52e24112e065.jpg" data-big="http://v.static.hv678.com/roombgimg/62e046c75c79464db4843c3e863ccadc.jpg"></span>
							<span><img src="http://v.static.hv678.com/roombgimg/c3a022b8d0844986b41134317a0aa2c8.jpg" data-big="http://v.static.hv678.com/roombgimg/a89aad0dcda843498320a29af4932d4e.jpg"></span>
							<span><img src="http://v.static.hv678.com/roombgimg/52b48d3654544fd5a62db7e2e277338f.jpg" data-big="http://v.static.hv678.com/roombgimg/09ac55dc09684802bdbff1581a7963e3.jpg"></span>
							<span><img src="http://v.static.hv678.com/roombgimg/fe5e31d1237c4988ba9afae89bdd31ce.jpg" data-big="http://v.static.hv678.com/roombgimg/a176d815fb2149f0aa7dfde5ccbc2a5e.jpg"></span>
							<span><img src="http://v.static.hv678.com/roombgimg/b292cc44fe9347c0909af70533c25e85.jpg" data-big="http://v.static.hv678.com/roombgimg/59b729ef0ddd4d328a39d68d6753752d.jpg"></span>
							<span><img src="http://v.static.hv678.com/roombgimg/1ea0aa017c6c49aa823961ed4e0e200a.jpg" data-big="http://v.static.hv678.com/roombgimg/8616d648a2f540ec83324db6529dde71.jpg"></span>
							<span><img src="http://v.static.hv678.com/roombgimg/4319e31c75af46f3afbe7670bdb3cd8f.jpg" data-big="http://v.static.hv678.com/roombgimg/8f0924202a8c44a081336495a26b708a.jpg"></span>
						</div>

					</div>

				</li>
			</ul>
		</div>
	</div>

	<div class="layui-hide" id="model_msg">
		<li class="chatli">
			<span class="msg-time"></span>
			<span class="msg-role"></span><span class="msg-name"></span>
			<span class="msg-content" style="color: inherit; font-size: inherit"></span>
		</li>

	</div>
</body>

</html>

<script src="~/ThirdParty/layui/2.2.2/layui.js"></script>

<script src="~/lib/signalr-client/dist/browser/signalr-client-1.0.0-alpha2-final.js"></script>

 
<script>
	//全局变量
	var isLogin = @User.Identity.IsAuthenticated.ToString().ToLower();
	var userInfo = @Html.Raw( Newtonsoft.Json.JsonConvert.SerializeObject(ViewBag.UserInfo));
	//弹出注册或登录
	var guestTimeout = @Model.GuestTimeOut;

	//房间信息
	var room = {
		"Id":'@Model.Id',
		"RoomNo":'@Model.RoomNo',
		"Name":'@Model.Name'
	};
	//用户信息
	var account = {


	}
</script>
<script src="~/Views/Home/index.js?v=@DateTime.Now.ToString("yyyyMMddhhmmssff") "></script>
<script>
	

	$(function () {
		//自动滚屏
		MsgScrollTop();

	});


	//左边的弹窗

	layui.use(['layer', 'form'], function () {
		var layer = layui.layer
			, form = layui.form;

		$('#room_content_2').find('li').click(function () {
			var url = $(this).attr('data-url');
			var title = $(this).find('p').eq(1).text();
			var id = $(this).attr('data-id');
			layer.open({
				type: 2,
				title: title //不显示标题栏
				, closeBtn: true
				, area: ['900px', '600px']
				, shade: 0.8
				, id: id //设定一个id，防止重复弹出
				//, btn: ['火速围观', '残忍拒绝']
				, btnAlign: 'c'
				, moveType: 1 //拖拽模式，0或者1
				, content: url //这里content是一个URL，如果你不想让iframe出现滚动条，你还可以content: ['http://sentsin.com', 'no']
			});

		});

		if (!isLogin)
		setTimeout(function () {
			 
			layer.confirm('请先登录?', { icon: 2, title: '提示' }, function (index) {
				//do something

				layer.close(index);
			});
			 
		 }, guestTimeout*60*1000);

	});


	layui.use(['carousel', 'form'], function () {
		var carousel = layui.carousel
			, form = layui.form;

		//常规轮播
		carousel.render({
			elem: '#test1'
			, arrow: 'always'
		});
	});


</script>